<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
	<th:block th:include="include :: header('运单详情')" />
	<th:block th:include="include :: jsonview-css" />
</head>
<body class="white-bg">
	<div class="wrapper wrapper-content animated fadeInRight ibox-content">
	<form class="form-horizontal m-t" id="signupForm">
		<input id="orderId" name="id" th:value="${tudaOrder.id}" type="hidden">
		<input id="orderType" name="orderType" th:value="${tudaOrder.orderType}" type="hidden">
		<div class="form-group">
			<label class="col-sm-2 control-label">提验人：</label>
			<div class="form-control-static" th:text="${tudaOrder.vehicleInspector}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">业务员：</label>
			<div class="form-control-static" th:text="${tudaOrder.userName}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">业务员电话：</label>
			<div class="form-control-static" th:text="${tudaOrder.salesmanPhone}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">车型：</label>
			<div class="form-control-static" th:text="${tudaOrder.vehicleModel}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">车架号：</label>
			<div class="form-control-static" th:text="${tudaOrder.vin}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">托运人：</label>
			<div class="form-control-static" th:text="${tudaOrder.client}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">托运人电话：</label>
			<div class="form-control-static" th:text="${tudaOrder.clientPhone}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">起始地：</label>
			<div class="form-control-static" th:text="${tudaOrder.origin}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">目的地：</label>
			<div class="form-control-static" th:text="${tudaOrder.dest}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">接收人：</label>
			<div class="form-control-static" th:text="${tudaOrder.receiver}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">接车人电话：</label>
			<div class="form-control-static" th:text="${tudaOrder.receiverPhone}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">支付方式：</label>
			<div class="label label-primary" th:text="${tudaOrder.payTypeValue}">
			</div>
		</div>

		<div class="form-group">
			<label class="col-sm-2 control-label">运费金额：</label>
			<div class="form-control-static" th:text="${tudaOrder.freightAmount}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">已付金额：</label>
			<div class="form-control-static" th:text="${tudaOrder.paidAmount}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">订单状态：</label>
			<div class="form-control-static" th:class="${tudaOrder.orderType == 6 ? 'label label-primary' : 'label label-danger'}" th:text="${tudaOrder.orderType == 6 ? '已支付' : '待付款'}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">利润：</label>
			<div class="form-control-static" th:text="${tudaOrder.profit}">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">备注：</label>
			<div class="form-control-static" th:text="${tudaOrder.notes}">

			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">数据状态：</label>
			<div class="form-control-static" th:class="${tudaOrder.isDelete == 0 ? 'label label-primary' : 'label label-danger'}" th:text="${tudaOrder.isDelete == 0 ? '正常' : '异常'}">
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">提验费(单位/元)：</label>
						<input  type="number" id="inspectionFee" name="inspectionFee" th:value="${tudaOrder.inspectionFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea type="text" id="inspection_notes" name="inspectionNotes" rows="3" style="width: 300px;" maxlength="150" placeholder="请输入内容">[[*{tudaOrder.inspectionNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="inspection_state" th:value="${tudaOrder.inspectionState}">
						<a th:class="${tudaOrder.inspectionState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('inspection_notes','inspection_state')">
							<div th:text="${tudaOrder.inspectionState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">代驾费(单位/元)：</label>
						<input type="number" id="drivingFee" name="drivingFee" th:value="${tudaOrder.drivingFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea type="text" id="driving_notes" name="drivingNotes" rows="3" style="width: 300px;" maxlength="150"  placeholder="请输入内容">[[*{tudaOrder.drivingNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="driving_state" th:value="${tudaOrder.drivingState}">
						<a th:class="${tudaOrder.drivingState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('driving_notes', 'driving_state')">
							<div  th:text="${tudaOrder.drivingState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">加油费(单位/元)：</label>
						<input type="number" id="refuelingFee" name="refuelingFee" th:value="${tudaOrder.refuelingFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea type="text" id="refueling_notes" name="refuelingNotes" rows="3" style="width: 300px;" maxlength="150"  placeholder="请输入内容">[[*{tudaOrder.refuelingNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="refueling_state" th:value="${tudaOrder.refuelingState}">
						<a th:class="${tudaOrder.refuelingState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('refueling_notes', 'refueling_state')">
							<div  th:text="${tudaOrder.refuelingState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">小板费(单位/元)：</label>
						<input type="number" id="smallBoardFee" name="smallBoardFee" th:value="${tudaOrder.smallBoardFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea type="text" id="small_board_notes" name="smallBoardNotes" rows="3" style="width: 300px;" maxlength="150"  placeholder="请输入内容">[[*{tudaOrder.smallBoardNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="small_board_state" th:value="${tudaOrder.smallBoardState}">
						<a th:class="${tudaOrder.smallBoardState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('small_board_notes', 'small_board_state')">
							<div  th:text="${tudaOrder.smallBoardState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">叉车费(单位/元)：</label>
						<input type="number" id="forkliftFee" name="forkliftFee" th:value="${tudaOrder.forkliftFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea type="text" id="forklift_notes" name="forkliftNotes" rows="3" style="width: 300px;" maxlength="150"   placeholder="请输入内容">[[*{tudaOrder.forkliftNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="forklift_state" th:value="${tudaOrder.forkliftState}">
						<a th:class="${tudaOrder.forkliftState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('forklift_notes', 'forklift_state')">
							<div  th:text="${tudaOrder.forkliftState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">中介费(单位/元)：</label>
						<input type="number" id="agencyFee" name="agencyFee" th:value="${tudaOrder.agencyFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea type="text" id="agency_notes" name="agencyNotes" rows="3" style="width: 300px;" maxlength="150"  placeholder="请输入内容">[[*{tudaOrder.agencyNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="agency_state" name="agencyState" th:value="${tudaOrder.agencyState}">
						<a th:class="${tudaOrder.agencyState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('agency_notes', 'agency_state')">
							<div  th:text="${tudaOrder.agencyState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div class="form-group">
			<div class="select-list">
				<ul>
					<li>
						<label style="margin: 5px 0px 0px 302px; width: 150px;">其他(单位/元)：</label>
						<input type="number" id="otherFee" name="otherFee" th:value="${tudaOrder.otherFee}" disabled/>
					</li>
					<li>
						<label>备注：</label>
						<textarea id="other_notes" name="otherNotes" maxlength="150" rows="3" style="width: 300px;" placeholder="请输入内容">[[*{tudaOrder.otherNotes}]]</textarea>
					</li>
					<li>
						<input type="hidden" id="other_state" name="otherState" th:value="${tudaOrder.otherState}">
						<a th:class="${tudaOrder.otherState == 1 ? 'btn btn-warning btn-rounded btn-sm' : 'btn btn-primary btn-rounded btn-sm'}" onclick="submitNotes('other_notes', 'other_state')">
							<div  th:text="${tudaOrder.otherState == 1 ? '结清' : '已结清'}"> </div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<h4 class="form-header h4">货运中转信息</h4>
		<div class="row">
			<div class="col-sm-12">
<!--				<button type="button" class="btn btn-white btn-sm" onclick="addRow()"><i class="fa fa-plus"> 增加</i></button>-->
<!--				<button type="button" class="btn btn-white btn-sm" onclick="sub.delRow()"><i class="fa fa-minus"> 删除</i></button>-->
				<div class="col-sm-12 select-table table-striped">
					<table id="bootstrap-table"></table>
				</div>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">汽车图片：</label>
		</div>
		<div class="form-group">
			<div class="col-sm-4" style="width: 20%" th:if="${tudaOrder.carImgList != null}" th:each="imgs,status: ${tudaOrder.carImgList}">
				<div class="contact-box">
					<div class="text-center">
						<a th:href="${imgs}" target="_blank">
							<img th:src="${imgs}" class="imgcode" width="280px" height="280px" alt="User Image">
						</a>
					</div>
				</div>
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">合同图片：</label>
		</div>
		<div class="form-group">
			<div class="col-sm-4" style="width: 20%" th:if="${tudaOrder.contractImgList != null}" th:each="imgs,status: ${tudaOrder.contractImgList}">
				<div class="contact-box">
					<div class="text-center">
						<a th:href="${imgs}" target="_blank">
							<img th:src="${imgs}" class="imgcode" width="280px" height="280px" alt="User Image">
						</a>
					</div>
				</div>
			</div>
		</div>
	</form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: jsonview-js" />
	<th:block th:include="include :: bootstrap-table-custom-view-js" />
    <script th:inline="javascript">
		function submitNotes(name, feeState){
			var fs = $("#"+feeState).val();
			if(fs == 1){
				var orderId = $("#orderId").val();
				var v = $("#"+name).val();
				table.set();
				$.modal.confirm("请确认此费用已结清", function() {
					var url = ctx + "system/finance/updateOrderFee";
					var data = { "orderId": orderId, "feeState": feeState, "feeName":name, "notes":v };
					$.operate.submit(url, "post", "json", data);
					if($("#"+feeState).val(2)){
						setTimeout( function(){
							window.location.reload();
						}, 1200 );
					}
				});
			}else {
				$.modal.msgSuccess("已结清，请勿重复操作");
			}
		}

		var prefix = ctx + "system/finance";
		var refundFlag = [[${@permission.hasPermi('system:finance:refund')}]];
		$(function() {
			var options = {
				refundUrl: prefix + "/refund",
				data: [[${tudaOrder.tudaOrderTransferList}]],
				pagination: false,
				showSearch: false,
				showRefresh: false,
				showToggle: false,
				showColumns: false,
				sidePagination: "client",
				columns: [
					{
						field: 'index',
						align: 'center',
						title: "序号",
						formatter: function (value, row, index) {
							var columnIndex = $.common.sprintf("<input type='hidden' name='index' value='%s'>", $.table.serialNumber(index));
							return columnIndex + $.table.serialNumber(index);
						}
					},
					{
						field: 'name',
						align: 'center',
						title: '中转段',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].name' value='%s' disabled>", index, value);
							return html;
						}
					},

					{
						field: 'transitBranch',
						align: 'center',
						title: '中转分公司',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].transitBranch' value='%s' disabled>", index, value);
							return html;
						}
					},

					{
						field: 'headPhone',
						align: 'center',
						title: '分公司负责人',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].headPhone' value='%s' disabled>", index, value);
							return html;
						}
					},
					{
						field: 'plateNumber',
						align: 'center',
						title: '车牌号',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].plateNumber' value='%s' disabled>", index, value);
							return html;
						}
					},
					{
						field: 'transporter',
						align: 'center',
						title: '驾驶员',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].transporter' value='%s' disabled>", index, value);
							return html;
						}
					},
					{
						field: 'transporterPhone',
						align: 'center',
						title: '驾驶员电话',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].transporterPhone' value='%s' disabled>", index, value);
							return html;
						}
					},

					{
						field: 'amount',
						align: 'center',
						title: '到收费用',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].amount' value='%s' disabled>", index, value);
							return html;
						}
					},

					{
						field: 'owes',
						align: 'center',
						title: '欠反',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].owes' value='%s' disabled>", index, value);
							return html;
						}
					},

					{
						field: 'transferFee',
						align: 'center',
						title: '中转费',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].transferFee' value='%s' disabled>", index, value);
							return html;
						}
					},
					{
						field: 'transitPoint',
						align: 'center',
						title: '中转地',
						formatter: function (value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].transitPoint' value='%s'>", index, value);
							return html;
						}
					},
					{
						field: 'state',
						align: 'center',
						title: '运输状态',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].state' value='运输中' disabled>", index, value);
							if(value == 2){
								html = $.common.sprintf("<input class='form-control' type='text' name='tudaOrderTransferList[%s].state' value='已完成' disabled>", index, value);
							}
							return html;
						}
					},

					{
						field: 'notes',
						align: 'center',
						title: '备注',
						formatter: function(value, row, index) {
							var html = $.common.sprintf("<input class='form-control' style='width: 120px;' type='text' name='tudaOrderTransferList[%s].notes' value='%s' disabled>", index, value);
							return html;
						}
					},
					{
						field: 'id',
						title: '操作',
						align: 'center',
						formatter: function(value, row, index) {
							if(row.owes > 0 && !row.refund){
								return '<a class="btn btn-success btn-xs' + refundFlag + '" href="javascript:void(0)" onclick="refund(\'' + row.id + '\')">确认已收款</a>';
							} else if(row.owes < 0 && !row.refund){
								return '<a class="btn btn-success btn-xs' + refundFlag + '" href="javascript:void(0)" onclick="refund(\'' + row.id + '\')">确认已返款</a>';
							}else if(row.refund){
								if(row.owes > 0){
									return '<a class="label label-primary">已收款</a>';
								}else if(row.owes < 0){
									return '<a class="label label-primary">已返款</a>';
								}
							}
						}
					}]
			};
			$.table.init(options);
		});

		function addRow() {
			var count = $("#" + table.options.id).bootstrapTable('getData').length;
			var row = {
				index: $.table.serialNumber(count),
				id: "",
				name: "",
				transitBranch: "",
				headPhone: "",
				plateNumber: "",
				transporter: "",
				transporterPhone: "",
				amount: "",
				owes: "",
				transferFee: "",
				state: "",
				notes: "",
				refund: "",
			}
			sub.addRow(row);
		}

		function refund (id) {
			table.set();
			$.modal.confirm("请确认信息无误，在确认操作", function() {
				var url = $.common.isEmpty(id) ? table.options.refundUrl : table.options.refundUrl.replace("{id}", id);
				if (table.options.type == table_type.bootstrapTreeTable) {
					$.operate.get(url);
				} else {
					var data = { "id": id };
					var config = {
						url: url,
						type: "post",
						dataType: "json",
						data: data,
						beforeSend: function () {
							$.modal.loading("正在处理中，请稍候...");
						},
						success: function(result) {
							if (typeof callback == "function") {
								callback(result);
							}
							$.operate.ajaxSuccess(result);
							window.location.reload();
						}
					};
					$.ajax(config)
				}
			});
		}
    </script>
</body>
</html>